import React, { useEffect, useState } from "react";
import style from "../index/index.module.css";
import request from "../../api/request";
import { CapsuleTabs } from "antd-mobile";
function Index() {
  const start = "北京";
  const end = "上海";
  const [plane, setPlane] = useState([]);

  const FeachList = async () => {
    const res = await request.get("/api/trip/airplane", {
      params: { start, end },
    });
    console.log(res);
    if (res.code === 200) {
      setPlane(res.data);
    }
  };
  useEffect(() => {
    FeachList();
  }, []);
  return (
    <div>
      <CapsuleTabs>
        <CapsuleTabs.Tab title="水果" key="fruits">
          {plane.length > 0 &&
            plane.map((item, index) => (
              <div key={index} className={style.plane}>
                <span>{item.dasn}</span>
                <span></span>
                <span>{item.aasn}</span>
                <span></span>

                <span>{item.ast}</span>
                <span></span>
                <span>{item.dst}</span>
                <span>￥{item.timespanNumber}</span>

                <span>{item.aat}</span>
                <span></span>
                <span>途经{item.fprt}站</span>
                <span></span>
              </div>
            ))}
        </CapsuleTabs.Tab>
        <CapsuleTabs.Tab title="蔬菜" key="vegetables">
          西红柿
        </CapsuleTabs.Tab>
        <CapsuleTabs.Tab title="动物" key="animals">
          蚂蚁
        </CapsuleTabs.Tab>
      </CapsuleTabs>
    </div>
  );
}

export default Index;
